<script setup lang="ts">
import microApp from "@micro-zoe/micro-app";
import { ref, watch } from "vue";
const current = ref(0)
const routerTochild = () => {
  microApp.router.push({
    name: "childHome",
    path: "/app2",
  });
};

const mricoSend = () => {
  microApp.setData("childHome", { data: "这是子应用向主应用发送的数据1" });
  microApp.setData("childHome", { name: "李慧峰" });
  microApp.setData("childHome", { age: 18 }, (res: any) => {
    console.log("数据已经发送完成", res);
  });
};

const logData = (data: any) => {
  console.log("这里是主应用的app组件，我收到了子应用传递的数据", data);
};
microApp.addDataListener("childHome", logData);

microApp.addGlobalDataListener((data: any) => {
  console.log("获取到全局数据", data);
});

microApp.addGlobalDataListener((data: any) => {
  console.log('接收到子应用强制推送的数据', data);
  const { current: cur = 0 } = data
  current.value = cur
})
</script>

<template>
  <div>主应用</div>
  <router-link to="/">主应用1</router-link>
  <router-link to="/demo">主应用2</router-link>
  <button @click="routerTochild">主应用跳转子应用页面2</button>
  <button @click="mricoSend">向子应用发送数据</button>
  <h4>{{ current }}</h4>
  <router-view></router-view>
</template>

<style lang="scss" scoped></style>
